import { Modal } from 'antd';
import './EditorHelperModal.scss';
import * as React from 'react';

export interface IEditorHelperModalProps {
  /** 是否可见 */
  visible: boolean;
  /** 可见性回调函数 */
  changeVisible: (visible: boolean) => void;
}

export default function EditorHelperModal(props: IEditorHelperModalProps) {
  return (
    <>
      <Modal
        title="帮助"
        open={props.visible}
        onCancel={() => {
          props.changeVisible(false);
        }}
        footer={null}
      >
        <p>按住鼠标中键 + 鼠标移动可以切换视角</p>
        <p>撤回快捷键：Ctrl + Z</p>
        <p>恢复快捷键：Ctrl + Y</p>
        <p>旋转快捷键：R</p>
        <p>平移快捷键：T</p>
        <p>缩放快捷键：S</p>
        <p>X轴快捷键：X</p>
        <p>Y轴快捷键：Y</p>
        <p>Z轴快捷键：Z</p>
      </Modal>
    </>
  );
}
